<template>
  <div class="wrapper">
    <div class="contents">
      <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="40%" class="ruleForm" >
        <el-row>
          <el-col span="18">
            <el-form-item label="用户名" prop="username">
              <el-input v-model="ruleForm.username" ></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col span="18">
            <el-form-item label="电话" prop="phone">
              <el-input v-model="ruleForm.phone"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col span="18">
            <el-form-item required label="身份证号" prop="idcard_number">
              <el-input v-model="ruleForm.idcard_number"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col span="18">
            <el-form-item required label="住址" prop="address">
              <el-input v-model="ruleForm.address"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col span="18">
            <el-form-item required label="密码" prop="password">
              <el-input type="password" v-model="ruleForm.password"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col span="18">
            <el-form-item required label="确认密码" prop="password2">
              <el-input type="password" v-model="ruleForm.password2"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-form-item>
          <el-button type="danger" plain>取消注册</el-button>
          <el-button type="success" @click="passwordCheck" plain>下一步</el-button>
        </el-form-item>
      </el-form>
    </div>
  </div>
</template>

<script>
  import Common from '@/components/common/Common';
    export default {
        name: "UserInfo",
        data(){
            return{
                ruleForm:{
                    username:'',
                    phone:'',
                    idcard_number:'',
                    address:'',
                    password:'',
                    password2:''
                },
                rules:{
                  username: [
                      {required:true, message: '请输入用户名', trigger: 'blur'},
                      {min: 6, max: 16, message: '请输入6到16个字符', trigger: 'blur'}
                  ],
                    phone: [
                        {required: true, message: '请输入手机号', trigger: 'blur'},
                        {min: 11, max: 11, message: '请输入正确的手机号', trigger: 'blur'}
                    ]
                }
            }
        },
        methods:{
          passwordCheck(){
              var pw1=this.ruleForm.password;
              var pw2=this.ruleForm.password2;
              if(pw1!=pw2){
                  alert('两次输入的密码不一致');
              }else{
                  this.$router.push({
                      name: 'BaseInfo'
                  });
              }
          }
        }
    }
</script>

<style scoped>

</style>
